<template>
	<view class="cu-modal bottom-modal" :class="{'show':isShow}" @click="hide">
		<view class="cu-dialog">
			<view class="modal-title">
				<text>优惠券</text>
			</view>
			<view class="tips">可领取优惠券</view>
			<view class="coupon-list">
				<!-- <view class="list">
						<view class="coupon-price">
							<view class="discounts">
								<text class="min">￥</text>
								<text class="max">200</text>
							</view>
							<view class="full-reduction">
								<text>满600元减200元</text>
							</view>
							<view class="jag"></view>
						</view>
						<view class="coupon-info">
							<view class="info-title">
								<view class="tag">
									<text>限品类券</text>
								</view>
								<view class="title">
									<text>仅可购买酒水部分商品</text>
								</view>
							</view>
							<view class="date-get">
								<view class="date">
									<text>2020.3.09-2020.03.15</text>
								</view>
								<view class="get">
									<text>点击领取</text>
								</view>
							</view>
						</view>
					</view> -->
				<view class="list" v-for="(item,index) in coupons" @click.stop>
					<view class="coupon-price">
						<view class="discounts">
							<text class="min">￥</text>
							<text class="max">{{item.coupon_price}}</text>
						</view>
						<view class="full-reduction">
							<text>{{item.title}}</text>
						</view>
						<view class="jag"></view>
					</view>
					<view class="coupon-info">
						<view class="info-title">
							<view class="tag">
								<text>限</text>
							</view>
							<view class="title">
								<text>仅可购买本商品</text>
							</view>
						</view>
						<view class="date-get">
							<view class="date">
								<text>{{item.start_time}}-{{item.end_time}}</text>
							</view>
							<view class="get">
								<text v-if="item.is_use == 0" @click="collectCoupon(item.id)">点击领取</text>
								<text v-else class="use">已领取</text>
							</view>
						</view>
					</view>
					<view class="use-status" v-if="item.is_use">
						<text>已领取</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isShow: false,
				isPage: false,
				coupons: [],
				goods_id: 0,
			}
		},
		onShow() {

		},
		methods: {
			getCoupon() {
				this.$http.get('store/getGoodsCouponList', {
					goods_id: this.goods_id
				}).then(res => {
					this.coupons = res.data.data
				})
			},
			collectCoupon(id) {
				console.log(id);
				let _this = this;
				this.$http.post('store/collectCoupon', {
					goods_id: this.goods_id,
					coupon_id: id
				}).then(res => {
					if(res.data.code == 200) {
						uni.showToast({
						    title: res.data.message,
						    duration: 2000,
							icon: 'success'
						});
						setTimeout(function(){
							_this.hide()
						},2000)
					}
					
					
					// this.coupons = res.data.data
				})
			},
			show(id) {
				this.goods_id = id;
				this.isPage = true;
				setTimeout(() => {
					this.isShow = true;
				}, 300)
				this.getCoupon();
			},
			hide() {
				this.isShow = false;
				setTimeout(() => {
					this.isPage = false;
				}, 300)
			},
		},
	}
</script>

<style scoped lang="scss">
	@import 'GoodsCoupon.scss';
</style>
